import 'package:fluent_ui/fluent_ui.dart';
import 'package:flutter/material.dart' as m;

class GyyDropDownRow extends StatefulWidget {
  const GyyDropDownRow({Key? key}) : super(key: key);

  @override
  State<GyyDropDownRow> createState() => _MaterialEquivalentsState();
}

class _MaterialEquivalentsState extends State<GyyDropDownRow> {
  final List<String> comboboxItems = [
    'A4塑封',
    'A4插页',
    'A4精装',
  ];
  String? comboboxItem;
  String dropdownItem = 'A4塑封';

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    Typography typography = FluentTheme.of(context).typography;

    List<List<Widget>> children = [
      [
        DropDownButton(
          items: comboboxItems
              .map(
                (e) => MenuFlyoutItem(
                  text: Text(e),
                  onPressed: () => setState(() => dropdownItem = e),
                ),
              )
              .toList(),
          title: Expanded(child: Text(dropdownItem, textAlign:TextAlign.left, style: typography.bodyStrong),),
        ),
        DropDownButton(
          items: comboboxItems
              .map(
                (e) => MenuFlyoutItem(
              text: Text(e),
              onPressed: () => setState(() => dropdownItem = e),
            ),
          )
              .toList(),
          title: Expanded(child: Text(dropdownItem, textAlign:TextAlign.left ),),
        ),
        DropDownButton(
          items: comboboxItems
              .map(
                (e) => MenuFlyoutItem(
              text: Text(e),
              onPressed: () => setState(() => dropdownItem = e),
            ),
          )
              .toList(),
          title: Expanded(child: Text(dropdownItem, textAlign:TextAlign.left ),),
        ),
        DropDownButton(
          items: comboboxItems
              .map(
                (e) => MenuFlyoutItem(
              text: Text(e),
              onPressed: () => setState(() => dropdownItem = e),
            ),
          )
              .toList(),
          title: Expanded(child: Text(dropdownItem, textAlign:TextAlign.left ),),
        ),
      ],

    ];

    Widget buildColumn(int index) {
      return Column(
        children: children
            .map(
              (children) => Container(
                constraints: const BoxConstraints(minHeight: 50.0),
                alignment: Alignment.center,
                child: children[index],
              ),
            )
            .toList(),
      );
    }

    return m.Material(
      type: m.MaterialType.transparency,
      child: Row(children: [
        Expanded(child: buildColumn(0)),
        Expanded(child: buildColumn(1)),
        Expanded(child: buildColumn(2)),
        Expanded(child: buildColumn(3)),
      ]),
    );
  }
}
